body{overflow: hidden;}
h2{color: #ddd;}
#bg{position: absolute;width: 100%;height: 100%;background: url("../images/login-bg.jpg") no-repeat;background-size: cover;-webkit-filter:blur(10px);filter:blur(10px);}
#main{position: absolute;height: 100%;width: 100%;overflow: hidden;}
#login-form{width: 400px;height: 300px;padding: 50px;padding-top: 100px;position: absolute;left: calc(50% - 225px);top:calc(50% - 225px);line-height: 50px;background: -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,.03),rgba(0,0,0,.1));}
#login-form input{border: solid 1px #fff;outline: none;width: 100%;height: 40px;line-height: 40px;padding-left: 10px;box-sizing: border-box;font-size: 15px;}
#login-form input:focus{border: solid 1px #0d8690;}
#loading{position: absolute;width: 100%;}
#loading{display: none;position: absolute;left: 0px;  top:0px; width: 100%;height: 100%;background-color: rgba(0,0,0,0.5);}
#loading > i{width: 100%;height: 10px;position: absolute;bottom:50%;background-color: white;border-radius: 8px;transition: 1s;background: -webkit-linear-gradient(left,red,#f96,yellow,green,#ace);}
#loading > i > i{width: 20px;height: 20px;border-radius: 50%;background-color: white;position: absolute;right: -2px;top: -5px;-webkit-animation: light 1s ease-out 0s infinite;-webkit-animation-direction: alternate;}

#login-btn{width: 100%}

@-webkit-keyframes slideInDown {
    0%{opacity: 0;transform: translateY(-1000px) scale(0.5);}
    100%{opacity: 1;transform: translateY(0px) scale(1);}
 }
@keyframes slideInDown {
    0%{opacity: 0;transform: translateY(-500px) scale(0.9);}
    100%{opacity: 1;transform: translateY(0px) scale(1);}
}
@-webkit-keyframes light {
    100%{box-shadow: 0  0 50px white;}
}
@-webkit-keyframes no {
    0%{transform: translateX(-80px)}
    10%{transform: translateX(0px)}
    20%{transform: translateX(60px) }
    30%{transform: translateX(0px)}
    40%{transform: translateX(-40px)}
    50%{transform: translateX(0px)}
    60%{transform: translateX(30px)}
    70%{transform: translateX(0px)}
    80%{transform: translateX(-20px)}
    90%{transform: translateX(0px)}
    100%{transform: translateX(0px)}
}

*{border: solid 0px;}